<template>
	<view class="store_result">
		<i-card top="20rpx" padding="64rpx 32rpx">
			<view class="result_status">
				<view class="da">
					<image v-if="resDetail.status === '10000003'" src="../../static/images/success_icon.png" mode="">
					</image>
					<image v-if="resDetail.status === '10000001' || resDetail.status === '10000002'"
						src="../../static/images/wait_icon.png" mode=""></image>
					<image v-if="resDetail.status === '10000004'" src="../../static/images/fail_icon.png" mode="">
					</image>
				</view>
				<text class="title">{{resDetail.statusDesc}}</text>
				<text>预计三个工作日提现到账</text>
			</view>
			<view class="buttons">
				<i-buttons radius="4" size="32" color="#16161F" bgColor="#fff" padding="18rpx 112rpx"
					@click="navTo('', 'navigateBack')">完成</i-buttons>
				<view style="height: 32rpx;"></view>
			</view>
		</i-card>
	</view>
</template>

<script lang="ts" setup>
	import {
		ref
	} from 'vue';
	import {
		navTo
	} from '../../utils/common'
	import useStore from '../../stores/index'
	import {
		getMerCashOrderDetail
	} from '../../api/store'
	import {
		onLoad
	} from '@dcloudio/uni-app'

	const resDetail = ref<GetMerCashOrderDetailRes['data']>({
		amount: 0,
		bankName: '',
		bankNo: '',
		cashOrderId: '',
		createTime: '',
		merRealName: '',
		rejectReason: '',
		status: '',
		statusDesc: '',
	})

	const type = ref('')
	const store = useStore()

	onLoad((option) => {
		if (option.cashOrderId) {
			type.value = 'store'
			getData(option.cashOrderId)
		}
	})

	const getData = async (cashOrderId : string) => {
		const data = await getMerCashOrderDetail({
			cashOrderId
		})
		resDetail.value = data.data
		console.log(data, 'datadata');
	}
	store.setUserInfo()
</script>

<style lang="scss" scoped>
	.store_result {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		background-color: $backColor;

		.result_status {
			@include flexCC;
			width: 100%;
			@include dfont(26rpx);
			color: #A0A0AD;
			padding-bottom: 40rpx;

			.da {
				width: 120rpx;
				height: 120rpx;
				margin: 20rpx 0;

				image {
					width: 120rpx;
					height: 120rpx;
				}
			}

			.title {
				@include titlefont;
				margin-bottom: 16rpx;
			}
		}
		.buttons {
			@include flexRC;
		}
	}
</style>